<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>详情页</title>
    <link rel="stylesheet" href="../css/detial.css">
</head>
<body>
     <!-- 页面最上方 -->
     <header>
        <div class="inner">
            <div class="inner1">
                <ul>
                    <li><a href="#">康佳新闻</a></li>
                    <li><a href="#">加入康佳</a></li>
                    <li><a href="#">校园招聘</a></li>
                    <li><a href="#">康佳社区</a></li>
                    <li><a href="#">大宗采购</a></li>
                    <li><a href="#">积分商城</a></li>
                </ul>
                <ul class="off">
                    <li><a href="./login.html">登录</a></li>
                    <li class="two"><a href="./regist.html">注册</a></li>
                </ul>
                <ul class="on active">
                    <li><span class="username">小王同学</span></li>
                </ul>
            </div>
            <div class="gouwuche">
                <img src="https://www.konka.com/themes/pc/konka/images/top-header-cart.png?v11c4" alt="">
                <p>购物车</p>
            </div>
        </div>
    </header>
    <!-- 导航栏  第一个二级菜单 -->
    
    <!-- 商品详情页 放大镜 -->
    <div class="goods_detial" id="box">
      <ul class="list">
        <!-- js 渲染 -->
      </ul>
      <div class="show">
          <!-- js 渲染 -->
      </div>
      <div class="enlarge"></div>
      <div class="discribe">
          <h3>阿波罗智慧电视 65A10S</h3>
          <div>4K超高清 MEMC超薄金属全面屏 2GB+32G内存 全景AI智慧屏 升降摄像头</div>
          <div><span>￥3999.00</span><span>￥4999.00</span></div>
          <div>
              <span>数量</span>
              <button>-</button>
              <input type="text" value="1" name="1">
              <button>+</button>
          </div>
          <div>
               <button class="buy">立即购买</button>
               <button class="add">加入购物车</button>
          </div>
      </div>
    </div>
    <script src="../js/utils.js"></script>
    <script src="../js/detial.js"></script>
    <script>
        // 引入文件以后 new 一下就实现了放大镜
        const e = new Enlarge('#box')
      </script>

</body>
</html>